<template>
  <div>
    <h1>Article Page</h1>
    <div>
      <ul>
        <li v-for="article in posts" :key="article.id">{{ article.title }}</li>
      </ul>
    </div>
  </div>
</template>

<script>
import { mapState, mapMutations, mapActions } from "vuex";

export default {
  name: "Article",
  asyncData({ store, route }) {
    console.log(store);
  },
  serverPrefetch() {
    return this.getPosts();
  },
  computed: {
    ...mapState(["posts"]),
  },

  methods: {
    ...mapActions(["getPosts"]),
  },
  created() {
    console.log("This is created hooks");
  },
  mounted() {
    this.getPosts()
    setTimeout(() => {
      console.log(this.$store.state.authInfo);
    }, 5000);
  },
};
</script>

<style>
</style>